<template>
	<view>

		<!-- 自提订单 -->
		<view style="position: relative;background-color: #fff;padding: 20rpx;" v-if="order">
			<view>
				<text style="color:#9a9baf">单据编号</text>
				<text style="margin-left: 20rpx;">{{order.moveid}}</text>
			</view>
			<view style="margin-top: 10rpx;">
				<text style="color:#9a9baf">创建时间</text>
				<text style="margin-left: 20rpx;">{{order.create_time}}</text>
			</view>
			<view style="margin-top: 10rpx;">
				<text style="color:#9a9baf">单据时间</text>
				<text style="margin-left: 20rpx;">{{order.shtime}}</text>
			</view>
			<view style="margin-top: 10rpx;">
				<text style="color:#9a9baf">调出仓</text>
				<text style="margin-left: 20rpx;">{{order.whout_name}}</text>
			</view>
			<view style="margin-top: 10rpx;">
				<text style="color:#9a9baf">调入仓</text>
				<text style="margin-left: 20rpx;">{{order.whin_name}}</text>
			</view>
			<view style="position: absolute;right:20rpx;top:20rpx">
				<up-tag :text="order.statu" plain size="mini" :type="getTagType(order)"></up-tag>
			</view>
		</view>

		<view style="margin-top: 20rpx;" v-if="order">
			<view style="font-size: 28rpx;
				font-weight: 300;
				background-color: #e3e8fb;
				padding: 8rpx 20rpx;
				display: flex;">
				<view style="flex:1">商品</view>
				<view style="width:180rpx">数量</view>
			</view>
			<view>
				<view class="row" style="background-color: #ffffff;"
					v-for="(item,index) in order.list">
					<view style="display: flex;padding: 20rpx 20rpx 0 20rpx;">
						<view style="flex:1">
							<view style="font-size: 24rpx;">
								<text
									style="color: #3c9cff;padding: 4rpx 16rpx;background-color: #edf0f9;">{{index+1}}</text>
								<text
									style="font-weight: bold;font-size: 30rpx;margin-left: 10rpx;">{{item.product_info.pname}}</text>
							</view>
							<view style="font-size: 24rpx;padding: 6rpx 0;">
								<!-- <text>1</text> -->
								<text
									style="margin-left: 10rpx;">{{item.product_info.formulatext}}</text>
							</view>
						</view>
						<view style="width:180rpx">
							<view style="font-weight: bold;font-size: 30rpx;">
								{{item.number+''+item.unit}}
							</view>
						</view>
					</view>
				</view>
			</view>
		</view>



		<drag-button :isDock="true" :existTabBar="true" text="返回" @btnClick="btnClick" />
	</view>
</template>

<script setup>
	import { ref, reactive, watch, nextTick, computed } from 'vue'
	import { onReady, onLoad } from "@dcloudio/uni-app"
	import { useStore } from "vuex";
	const store = useStore();
	const app = getApp()

	onLoad(async (options) => {
		const res = await app.globalData.http.get(`/move/detail/${options.id}`)
		order.value = res.data
	})

	// data
	const order = ref(null)

	// 状态颜色
	const getTagType = (item) => {
		if (item.statu == '待审核') {
			return 'warning'
		} else if (item.statu == '已审核') {
			return 'success'
		}
	}

	// 悬浮按钮点击返回主页
	const btnClick = () => {
		uni.switchTab({
			url: '/pages/work'
		});
	}
	
</script>

<style lang="scss">

</style>